<template>
<div class="father">
    <h3>父组件</h3>
    <p>a:{{ a }}</p>
    <p>汽车信息:{{ car.name }} {{ car.price }}</p>
    <Child />
</div>
</template>

<script lang="ts" setup name="Father">
import { provide, reactive, ref } from 'vue';
import Child from './Child.vue';

let a = ref(100)
let car = reactive({name:"宝马",price:30})

provide('assets', {a, earn})
provide('carinfo', car)

function earn(){
    a.value += 1000
}
</script>

<style scoped>
.father{
    background-color: rgb(164, 164, 164);
    padding: 20px;
    border-radius: 10px;
}
</style>